layui.use(['table', 'jquery'], function () {
    let table = layui.table
        , $ = layui.jquery
        , layer = layui.layer
        , form = layui.form;
    table.render({
        elem: '#title-info'
        , toolbar: true
        , title: '选题信息表'
        , url: '/titleInfo'
        , page: true
        , where: {sno: sno}
        , even: true
        , cols: [[ //标题栏
            {field: 'xtId', title: '编号', sort: true, hide: true}
            , {field: 'title', title: '课题名称'}
            , {field: 'collegeName', title: '学院'}
            , {field: 'majorName', title: '专业'}
            , {field: 'no', title: '学号'}
            , {field: 'sname', title: '姓名'}
            , {field: 'tName', title: '指导教师'}
            , {field: 'tno', title: '教师工号'}
            , {field: 'state', title: '状态', align: 'center',templet: '#stateTpl'}
            , {field: 'isPass', title: '是否通过',align: 'center', templet: '#isPassTpl'}
            , {fixed: 'right', title: '操作', toolbar: '#title-tool', width: 120}
        ]]
        , text: {
            none: '<div class="layui-anim layui-anim-scaleSpring"  style="margin-top: 150px"><i class="layui-icon"  style="color: #009f95;font-size: 150px;border-bottom: #009f95 solid 2px;padding:15px;margin-top: 50px" >&#xe664;</i><br>' +
                '<br><br><br><br><div class="layui-text" style="font-size: 25px;margin-top: 25px;color: #009f95">好像没有没找到数据呢</div></div>'
            ,
            error: '<div style="margin-top: 150px"><i class="layui-icon"  style="color: #009f95;font-size: 150px;border-bottom: #009f95 solid 2px;padding:15px;margin-top: 50px" >&#xe664;</i><br>' +
                '<br><div class="layui-text" style="font-size: 25px;margin-top: 25px;color: #009f95">好像没有出错了呢</div></div>'
        }
    });

    let flag = true;
    $.ajax({
        url: "/titleInfo",
        type: 'post',
        data: {sno: sno, page: 1, limit: 100},
        dataType: 'json',
        success: function (json) {
            for (let i = 0; i < json.count; i++) {
                if (json.data[i].state === "审核中") {
                    flag = false;
                }
            }
        }
    })
    $.ajax({
        url: "/getPaper",
        type: 'post',
        data: {
            userName: sno, state: "任务书", type: 1, page: 1, limit: 100
        },
        dataType: 'json',
        success: function (json) {
            if (json.count != 0) {
                flag = false;
            }
        }
    })
    //绑定自主申报课题按钮
    $('#title-add-btn').click(function () {
        if (flag === true) {
            let page = layer.open({
                type: 1
                , offset: 10
                , area: [700, 550]
                , content: $("#add-box")
                , success: function () {
                }
                , end: function () {
                    $("#add-box").css("display", 'none');
                }
            });
        } else {
            layer.msg("你已申请课题，不可多次申请")
        }

    });

    //监听提交
    form.on('submit(save-and-submit)', function (data) {
        layer.confirm('确认提交？', function () {
            //console.log(data.field); //当前容器的全部表单字段，名值对形式：{name: value}
            let taskData = JSON.stringify(data.field);
            let loadPage = layui.layer.load(0, {shade: [0.5, '#fff']});
            $.ajax({
                url: "/addTitle",
                type: 'post',
                data: {
                    taskData: taskData, userName: sno, type: 1
                },
                dataType: 'json',
                success: function (data) {  //调用接口成功
                    if (data === true || data === 'true') {
                        layer.close(loadPage);
                        layer.closeAll('page');
                        layui.layer.msg('申请成功！', {offset: '300px', time: 2500, anim: 0});
                        table.reload('title-info', {
                            where: {sno: sno}
                        });
                    } else {
                        layui.layer.close(loadPage);
                        layui.layer.alert('申请失败！');
                    }
                },
                error: function () {  //接口错误
                    layui.layer.close(loadPage);
                    layui.layer.alert('服务器出错啦,请稍后再试！');
                }
            });
        });
        return false;//阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });


    //监听行工具事件
    table.on('tool(title-info)', function (obj) {
        let data = obj.data;
        if (obj.event === 'query') {
            layer.open({
                type: 1
                , offset: 50
                , shade: [0.3, '#000']
                , shadeClose: true
                , skin: 'layui-layer-rim'
                , area: ['740px', '600px']
                , content: $("#task-detail")
                , title: '学生申请课题详情内容'
                , success: function (layerObj) {
                    $(".layui-layer-shade").appendTo(layerObj.parent());//解决弹窗点不到屏幕变暗的问题
                    setTaskDetail(data);
                }
                , end: function () {
                    $("#task-detail").css("display", 'none');
                }
            });
        } else if (obj.event === 'edit') {
            if (data.state === "审核中" || data.state === "审核完成") {
                layer.msg("已提交不可修改")
            } else {
                let page = layer.open({
                    type: 1
                    , offset: 10
                    , area: [700, 550]
                    , content: $("#add-box")
                    , end: function () {
                        $("#add-box").css("display", 'none');
                    }
                });
            }

        }
    });

    //设置详情页面
    function setTaskDetail(data) {
        $("#task-intr").html(data.intr);
        $("#task-from").html(data.from);
        $("#task-category").html(data.categoty);
        $("#task-addtime").html(data.addtime);
        $("#task-nature").html(data.nature);
        $("#task-college").html(data.collegeName);
        $("#task-major").html(data.majorName);
        $("#task-tname").html(data.tName);
        $("#task-state").html(data.state);
        $("#task-no").html(data.no);
        $("#task-id").html(data.xtId);
        $("#task-title").html(data.title);
        $("#task-tno").html(data.tno);
        $("#task-sname").html(data.sname);
        $("#task-opinion").html(data.opinoin);
        $("#task-isPass").html(data.isPass);

    }
});